uniapp,uview发送验证码效果

您所在的位置：网站首页 › before style › uniapp,uview发送验证码效果

uniapp,uview发送验证码效果

2023-04-17 02:53| 来源: 网络整理| 查看: 265

uniapp,uview发送验证码效果原创

深漂小码哥 2021-03-10 13:35:21 ©著作权

文章标签 android 文章分类 Android 移动开发

©著作权归作者所有：来自51CTO博客作者深漂小码哥的原创作品，请联系作者获取转载授权，否则将追究法律责任 {{tips}} export default { data() { return { tips: '', seconds: 10, status: 1 } }, methods: { codeChange(text) { this.tips = text; }, getVerifyCode() { if(this.$refs.uCode.canGetCode) { // 模拟向后端请求验证码 uni.showLoading({ title: '正在获取验证码' }) setTimeout(() => { uni.hideLoading(); // 这里此提示会被this.start()方法中的提示覆盖 this.$u.toast('验证码已发送'); // 通知验证码组件内部开始倒计时 this.$refs.uCode.start(); }, 2000); } else { this.$u.toast('倒计时结束后再发送'); } }, end() { this.status = 1 // this.$u.toast('倒计时结束'); }, start() { this.status = 2 // this.$u.toast('倒计时开始'); } } } .before-style { background: #007AFF; width: 100%; color: #fff; text-align: center; border: none; padding-top: 20rpx; padding-bottom: 20rpx; border-radius: 10rpx; } .after-style { background:#C0C4CC; width: 100%; color: #fff; text-align: center; border: none; padding-top: 20rpx; padding-bottom: 20rpx; border-radius: 10rpx; }

赞收藏评论分享举报

上一篇：uniapp Now you can provide attr `wx:key` for a `wx:for` to improve performance.

下一篇：uniapp实现动态增删元素

【本文地址】

uniapp,uview发送验证码效果

uniapp,uview发送验证码效果

今日新闻

推荐新闻